<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>设计支持音频，视频播放的网页</title>
    <style type="text/css">
        h2{
            font: bold;
            font-family: 黑体;
            text-align: center;
        }
        p{
            text-align: center;
            font: 20px 黑体;
        }
        ul{
            list-style-type: none;
        }
        li{
            float: left;
            margin: 20px;
        }
        div{
            height: 250px;
            background-color: #99cc00;
            text-align: center;
        }
        marquee{
            font-size: 16px;
            padding: 4px auto;
            color: pink;
        }
        img{
            width: 500px;
            height: 230px;
        }
        embed{
            width: 400px;
            height: 230px;
        }
    </style>

<body>
    <h2>明月几时有</h2>
    <hr color="red">
    <p> 明月几时有？把酒问青天。<br>
        不知天上宫阙，今夕是何年。<br>
        我欲乘风归去，又恐琼楼玉宇，高处不胜寒，起舞弄清影，何似在人间。 <br>
        转朱阁，抵绮户，照无眠。<br>
        不应有恨，何事偏向别时圆。  <br> 
        人有悲欢离合，月有阴晴圆缺，此事古难全。<br> 
        但愿人长久，千里共婵娟。</p>
    <hr color="yellow">
    <div>
        <ul>
            <li><embed src="../img/1608895463911e491b12f88c69.MOV_last.mp4" type="" autostart="true"></li>
            <li><img src="../img/3.jpg" alt=""></li>    
            <li><embed src="../img/蔡琴明月几时有.mp3" type="" autostart="true" controls></li>
        </ul>
    </div>    
    <marquee behavior="" direction="left" onmouseover="this.stop" onmouseout="this.start()">欢迎来到我的多媒体世界</marquee>
</body>
</html>